<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath %>">
<title>商品信息管理</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<%-- 引用layui.css --%>
<link rel="stylesheet" type="text/css" href="<%=basePath %>js/layui/css/layui.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath %>css/common.css" />
</head>
<body>
	<div class="ibox">
		<div class="ibox-content bodycss">
			<!-- 表单搜索 开始 -->
		 	<section class="panel panel-padding ">
			<form class="layui-form layui-form-pane form-search"
				onsubmit="return false" method="post">
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">商品名称</label>
					<div class="layui-input-inline">
						<input name="orderSn" id="orderSn" value="" placeholder="请输入商品名称"
							class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">商品状态</label>
					<div class="layui-input-inline" >
						<div  style="width:150px">
							<select name="status" id="status" >
								<option value="">请选择</option>
								<option value="1">上架</option>
								<option value="0">下架</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">商品属性</label>
					<div class="layui-input-inline" >
						<div  style="width:150px">
							<select name="isNormal" id="isNormal" >
								<option value="">请选择</option>
								<option value="0">正品</option>
								<option value="1">打折</option>
								<option value="2">体验</option>
								<option value="3">积分兑换</option>
								<option value="4">用来打包</option>
								<option value="7">可兑换打包品</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label" style="">商品分类</label>
					<div class="layui-input-inline">
						<select name="quiz1" id="quiz1" lay-filter="peojectfilter1">
						</select>
					</div>
					<div class="layui-input-inline">
						<select name="quiz2" id="quiz2" lay-filter="peojectfilter2">
						</select>
					</div>
					<div class="layui-input-inline">
						<select name="quiz3" id="quiz3">
						</select>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label" style="">积分兑换</label>
					<div class="layui-input-inline" >
						<div  style="width:150px">
							<select name="integralBuy" id="integralBuy" >
								<option value="">请选择</option>
								<option value="1">是</option>
								<option value="0">否</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">品牌(供应商)</label>
					<div class="layui-input-inline">
						<input name="userName" id="userName" value="" placeholder="品牌(供应商)"
							class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="seach">
						<i class="layui-icon"></i> 搜 索
					</button>
				</div>
			</form>
			</section>
			<!-- 表单搜索 结束 -->
			<section class="panel panel-padding ">
			<table class="layui-table"
				lay-data="{
	                        id: 'menuTeble',
	                        width:'auto',
	                        url:'goodsDetail/list.do',
	                        page:true,
	                        method:'post',
	                        even:true,
	                        skin:'row',
	                        limits:[10,20,30,40,50],
	                        limit:10}"
				lay-filter="popedomLay">
				<thead>
					<tr>
						<th lay-data="{checkbox:true,disabledKey:'check_status',disabledKeyValue:'1,2'}"></th>
						<th lay-data="{type:'numbers', width:50}">序号</th>
						<!-- <th lay-data="{field:'orderId', width:120,align:'center'}">订单id</th> -->
						<th lay-data="{field:'goodsName', width:160,align:'center'}">商品名称</th>
						<th lay-data="{field:'gc1', width:120,align:'center'}">商品一级分类</th>
						<th lay-data="{field:'gc2', width:120,align:'center'}">商品二级分类</th>
						<th lay-data="{field:'gc3', width:120,align:'center'}">商品三级分类</th>
						<th lay-data="{field:'brandName', width:200,align:'center'}">品牌(供应商)</th>
						<th lay-data="{field:'specifications', width:80,align:'center'}">规格</th>
						<th lay-data="{field:'goodsPrice', width:100,align:'center'}">销售价格</th>
						<th lay-data="{field:'isNormal', width:120,align:'center',templet:'#n_type'}">商品属性</th>
						<th lay-data="{field:'awardedIntegral', width:120,align:'center'}">赠送积分</th>
						<th lay-data="{field:'integralBuy', width:140,align:'center',templet:'#i_type'}">支持积分兑换</th>
						<th lay-data="{field:'goodsExchIntegral', width:140,align:'center',templet:'#g_type'}">兑换所需积分</th>
						<th lay-data="{field:'status', width:120,align:'center',templet:'#m_type'}">状态</th>
						<th lay-data="{fixed: 'right', width:250, align:'center', toolbar: '#popedomBar'}">操作</th>
					</tr>
				</thead>
			</table>
			</section>
		</div>
	</div>
	<script type="text/html" id="g_type">	
	    {{#  if(d.goodsExchIntegral ==null) {  }}
			{{0}}
		{{#  } else {  }}
			{{d.goodsExchIntegral}}
		{{#  }  }}
    </script>
	<script type="text/html" id="m_type">
	    {{#  if(d.status =="0") {  }}
			<font color="#00ff00">下架</font>
		{{#  } else if(d.status =="1") {  }}
			<font color="#ff0000">上架</font>
		{{#  }  }}
    </script>
	<script type="text/html" id="i_type">	
	    {{#  if(d.integralBuy =="0") {  }}
			<font color="#00ff00">否</font>
		{{#  } else if(d.integralBuy =="1") {  }}
			<font color="#ff0000">是</font>
		{{#  }  }}
    </script>
	<script type="text/html" id="n_type">
	    {{#  if(d.isNormal =="0") {  }}
			<font color="#00ff00">正品</font>
		{{#  } else if(d.isNormal =="1") {  }}
			<font color="#ff0000">打折</font>
		{{#  } else if(d.isNormal =="2") {  }}
			<font color="#ff0000">体验</font>
		{{#  } else if(d.isNormal =="3") {  }}
			<font color="#ff0000">积分兑换</font>
		{{#  } else if(d.isNormal =="4") {  }}
			<font color="#ff0000">用来打包</font>
		{{#  } else if(d.isNormal =="7") {  }}
			<font color="#ff0000">可兑换打包品</font>
		{{#  }  }}
    </script>
	<script type="text/html" id="popedomBar">
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="updt">上/下架</a>
			<a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="edits">编辑图片</a>
			<%--<a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="edit">编辑行</a>--%>
			<a class="layui-btn layui-bg-cyan layui-btn-xs"  lay-event="del">删除</a>
    </script>
	<script type="text/javascript" src="<%=basePath %>js/layui/layui.js"></script>
	<script type="text/javascript" src="<%=basePath %>js/common/jquery-1.8.3.min.js"></script>
	<script type="text/javascript">
	layui.config({
	    base: "<%=basePath%>js/common/"
	}).use(["common", "element", "layer", "form", "table", "jquery"], function(){
			var elem = layui.element;
			var layer = layui.layer;
			var form = layui.form;
			var table = layui.table;
			var $ = layui.jquery;
			layui.common.init();
		//监听工具条
		table.on('tool(popedomLay)', function(obj){
			var data = obj.data;
			if(obj.event === 'updt'){
				layer.confirm('确认修改么', function(index) {
					$.ajax({
						type: "post",
						dataType: "json",
						url: 'goodsDetail/updateStatu.do',
						data: data,
						success: function (json) {
							if(json.statusCode == 200){
								layer.msg(json.message, {icon: 6,time: 2000});
								table.reload('menuTeble')
							} else{
								layer.msg(json.message, {icon: 5,time: 2000});
							}
						}
					});
					layer.close(index);
				});
			}else if (obj.event === 'edits') {
				layer.open({
					type: 2,
					title: '修改商品图片信息',
					content: 'goodsDetail/toPicsPage.do?goodsId=' + data.goodsId,
					area: ['1400px', '800px'],
					anim: 5,
					isOutAnim: true,
					maxmin: true,
					resize: false,
					moveOut: true,
					zIndex: 99999,
					success: function (layero, index) {
						var body = layer.getChildFrame('body', index);
					},
					end: function () {
						table.reload("menuTeble");
					}
				});
			}else if(obj.event === 'del'){
				layer.confirm('真的删除行么', function(index){
					$.ajax({
						type: "post",
						dataType: "json",
						url: 'goodsDetail/deleteGoodsDetail.do',
						data: data,
						success: function (json) {
							if(json.statusCode == 200){
								layer.msg(json.message, {icon: 6,time: 2000});
								table.reload('menuTeble')
							} else{
								layer.msg(json.message, {icon: 5,time: 2000});
							}
						}
					});
					obj.del();
					layer.close(index);
				});
			} else if(obj.event === 'edit'){
				layer.alert('编辑行：<br>'+ JSON.stringify(data))
			}
		});
		//级联给一级选择框赋值
		$.ajax({
			type:"POST",
			cache:false,
			url:"goodsDetail/querySysBy.do",
			data:{"gcParentId":0},
			dataType:"json",
			success:function(data){
				//$("#quiz1").empty();
				if(data != '200') {
					$("#quiz1").append(new Option("请选择", ""));
					$.each(data, function (i, n) {
						$item = $("<option>" + n.gcName + "</option>");
						$item.val(n.gcId);
						$('#quiz1').append($item);
					})
				}else {
					$("#quiz2").append(new Option("请选择", ""));
				}
					layui.form.render("select");
			}
		});
		//级联给二级选择框赋值
		form.on('select(peojectfilter1)',function(data){
			var gcParentId=data.value;
			$.ajax({
				type:"POST",
				cache:false,
				url:"goodsDetail/querySysBy.do",
				data:{"gcParentId":gcParentId},
				dataType:"json",
				success:function(data1){
					$("#quiz2").empty();
					$("#quiz3").empty();
					console.log(data1)
					if(data1 != '200') {
						$("#quiz2").append(new Option("请选择", ""));
						$.each(data1, function (i, n) {
							/*$item = $("<option>"+n.gcName+"</option>");
							$item.val(n.gcId);
							$('#quiz2').val($item);*/
							$item = $("<option>" + n.gcName + "</option>");
							$item.val(n.gcId);
							$('#quiz2').append($item);
						})
					}else {
						$("#quiz2").append(new Option("请选择", ""));
					}
					layui.form.render("select");
				}
			});
		});
		//级联给三级选择框赋值
		form.on('select(peojectfilter2)',function(data){
			console.log(data)
			var gcParentId=data.value;
			console.log(gcParentId)
			$.ajax({
				type:"POST",
				cache:false,
				url:"goodsDetail/querySysBy.do",
				data:{"gcParentId":gcParentId},
				dataType:"json",
				success:function(data1){
					console.log(data1)
					$("#quiz3").empty();
					if(data1 != '200') {
						$("#quiz3").append(new Option("请选择", ""));
						$.each(data1, function (i, n) {
							/*$item = $("<option>"+n.gcName+"</option>");
							$item.val(n.gcId);
							$('#quiz3').val($item);*/
							$('#quiz3').append(new Option(n.gcName));
						})
					}else {
						$("#quiz3").append(new Option("请选择", ""));
					}
					layui.form.render("select");
				}
			});
		});
			/**
			 * 监听刷新表格
			 */
		form.on('submit(seach)', function(data){
		 console.log(JSON.stringify(data.field));
			table.reload('menuTeble', {
				where: data.field,
				page : {
					curr : 1
				}
			});
			return false;
		});
	});
</script>
</body>
</html>
